<template>
  <div>
    <el-select filterable clearable v-model="selected" @change="handleSelect" >
      <el-option
        v-for="team in race_cup_teams"
        :key="team.value"
        :label="team.label"
        :value="team"
        :disabled="team.disabled">
      </el-option>
    </el-select>
  </div>
</template>

<script>
import {mapGetters} from 'vuex'
export default {
  props: {
  },
  computed: {
    ...mapGetters({
      race_cup_teams: 'race_cup_teams'
    })
  },
  created () {
  },
  data () {
    return {
      selected: {},
      teamList: []
    }
  },
  methods: {
    handleSelect () {
      if (!this.selected) {
        this.$emit('clear', this.selected)
      } else {
        this.$set(this.race_cup_teams[this.selected.value], 'disabled', !this.race_cup_teams[this.selected.disabled] || true)
        this.$emit('change', this.selected)
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.el-select-dropdown__item.is-disabled{
  display: none;
}
</style>
